/* eslint-disable */
const path = require('path')

module.exports = {
    lintOnSave: false,
    chainWebpack: config => {
        const dir = path.resolve(__dirname, 'src/assets/icons')

        // config是Vue把webpack配置封装成了对象暴露给我们的接口
        config.module
            // 添加一个规则的名字，叫做svg-sprite
            .rule('svg-sprite')
            // 如果文件能匹配上下面的正则，则使用这个规则，就是以.svg结尾的
            .test(/\.svg$/)
            // 因为我们不想让整个项目的svg都走这个规则所以，我们需要include包含指定的目录，只包含icons目录
            .include.add(dir).end()
            // 使用哪些loader，使用svg-sprite-loader，extract:false是不要把它解析出文件来
            .use('svg-sprite-loader').loader('svg-sprite-loader').options({extract: false}).end()
            // 使用 svgo-loader
            // .use('svgo-loader').loader('svgo-loader')
            // 删除fill属性
            // .tap(options => ({...options, plugins: [{removeAttrs: {attrs: 'fill'}}]})).end()
        // 使用svg-sprite-loader目录下的plugin
        config.plugin('svg-sprite').use(require('svg-sprite-loader-mod/plugin'), [{plainSprite: true}])
        // 排除其他的svg，只要不在icons目录下的svg都不走这个规则
        config.module.rule('svg').exclude.add(dir)
    }
}